<template>
  <div class="app-container">
    <wms-form v-model:query-params="queryParams" :form-list="formList" @query="getList" label-width="88px"
      @export="handleExport">
    </wms-form>
    <wms-table :loading="loading" :data-list="spuList" :column="column" :pageInfo="queryParams" @get-list="getList"
      @edit="eidtSpu" />
    <add-or-update v-if="showEdit" v-model="showEdit" :spu-details="spuDetails" @refresh="getList" />
  </div>
</template>

<script setup name="Spu">
import { listSpu, getSpu, delSpu, addSpu, updateSpu } from "@/api/wms/spu";
import WmsTable from '@/components/WmsTable/index.vue'
import WmsForm from '@/components/WmsForm/index.vue'
import AddOrUpdate from './components/spu-add-or-update.vue'
import { data, column, formList } from './index.js'
import { ref, reactive, getCurrentInstance, onMounted } from "vue";

const { proxy } = getCurrentInstance();
const queryParams = reactive(data.queryParams);

const spuList = ref([]);
const loading = ref(true);
let showEdit = ref(false)
let spuDetails = reactive({
  spuId: null,
  spuNo: null,
})

/** 查询物料列表 */
function getList() {
  loading.value = true;
  listSpu(proxy.addDateRange(queryParams, queryParams.dateRange)).then(
    (response) => {
      spuList.value = response.rows;
      queryParams.total = response.total;
      loading.value = false;
    }
  );
}

// 表单重置
function reset() {
  form.value = {
    spuId: null,
    spuNo: null,
    spuCode: null,
    spuName: null,
    spuInfo: null,
    spuType: null,
    spuSpec: null,
    spuPickType: null,
    spuStatus: null,
    statusLable: null,
    delFlag: null,
    defWarehouseId: null,
    defZoneId: null,
    isQuality: null,
    qualityDays: null,
    createName: null,
    comments: null,
  };
  proxy.resetForm("spuRef");
}

/** 搜索按钮操作 */
function handleQuery() {
  queryParams.pageNum = 1;
  getList();
}

/** 重置按钮操作 */
function resetQuery() {
  queryParams.dateRange = [];
  proxy.resetForm("queryRef");
  handleQuery();
}

/** 导出按钮操作 */
function handleExport() {
  proxy.download(
    "wms/spu/export",
    {
      ...queryParams,
    },
    `基础物料_${new Date().getTime()}.xlsx`
  );
}

const eidtSpu = (row) => {
  console.log("基础物料编辑：", row)
  showEdit.value = true;
  spuDetails.spuId = row.spuId;
  spuDetails.spuNo = row.spuNo;
}

getList();
</script>
